<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ&JS</title>
    <style>
        div{
            border: 10px solid aqua;
            width: 300px;
            height: 300px;
            margin: 10px;
        }
    </style>
    <script src="../js1/jquery-1.11.0.min.js"></script>
    <script>
        /*JQ加载*/
        /*
         问题:
         JS对象能不能使用JQ的函数text()
         JQ对象能不能使用JS的属性innerText
        * */
        $(function () {
            //可以写js代码，也可以写jq代码
            //通过JD给div1设置内容
            var div1 = document.getElementById("div1");
            div1.innerText = "JS设置的新内容";
            //JS对象不能调用JQ函数,所以讲JS对象转换成JQ
            /**JS -> JQ的转换*/
            $(div1).text("JQ给div1设置的新内容");
        });


        //通过JQ给div2设置内容 ->选择器
        //JS ->  var div2 = document.getElementById("div2");
        //JQ使用选择器取代了getElementxxxx()
        $(function () {
            $("#div2").text("JQ设置的新内容");
            /**JQ -> JS的转换(了解即可)*/
            $("#div2").get(0).innerText ="JS给div2设置的新内容";
        });




    </script>
</head>
<body>
   <div id="div1">div1</div>
   <div id="div2">div2</div>
</body>
</html>